<nav class="nav-extended brand-fixed">
    <div class="nav-wrapper">
        <div class="col s12 center-align clearfix" ng-hide="vm.type == 'brandshop'">
            <a href="javascript:void(0);" class="breadcrumb left" ng-click="vm.tabSeen = false;"><i class="fa fa-angle-left"></i>返回</a>
            <span class="sub title">{{vm.title}}xxxx品牌详情</span>
        </div>
    </div>
    <div class="nav-content container clearfix">
        <div class="left">
            <ul class="tabs tabs-transparent">
                <li class="tab" ng-repeat="item in ['品牌概况','销售额','销售量','店铺数','店铺/宝贝'] track by $index" ng-click="vm.anchor.gotoAnchor($index)"><a href="javascript:;" ng-class="{'active': vm.anchor.index == $index }">{{::item}}</a></li>
            </ul>
        </div>
        <div class="right">
            <time-picker-component></time-picker-component>
        </div>
    </div>
</nav>
<div class="container brand-detail-box">
    <div class="row"></div>
    <div class="row" id="anchor0">
        <div class="col s12">
            <div class="card-panel clearfix">
                <h5>品牌概况</h5>
                <div class="divider"></div>
                <div class="col s12">
                    <div class="col s12 m4">
                        <p>类目分析</p>
                        <div class="card-con" id="brand-detail-pie" style="height: 400px;"></div>
                    </div>
                    <div class="col s12 m5">
                        <p>类目分析</p>
                        <div class="card-con" id="brand-detail-cat-line" style="height: 400px;"></div>
                    </div>
                    <ul class="col s12 m3">
                        <li class="tile teal">
                            <div class="tile-header">
                                销售量
                            </div>
                            <div class="tile-content">
                                <b>99999999</b>
                            </div>
                        </li>
                        <li class="tile blue">
                            <div class="tile-header">
                                销售额
                            </div>
                            <div class="tile-content">
                                <b>99999999</b>
                            </div>
                        </li>
                        <li class="tile cyan">
                            <div class="tile-header">
                                店铺数
                            </div>
                            <div class="tile-content">
                                <b>99999999</b>
                            </div>
                        </li>
                        <li class="tile grey">
                            <div class="tile-header">
                                宝贝数
                            </div>
                            <div class="tile-content">
                                <b>99999999</b>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!--销售额  -->
    <div class="row" id="anchor1">
        <div class="col s12">
            <div class="card-panel clearfix">
                <h5>销售额</h5>
                <div class="divider"></div>
                <div class="col s12">
                    <div class="col s12 m6">
                        <p>平台销售占比</p>
                        <div id="brand-detail-component-sellMoneny" style="height: 400px;">
                        </div>
                    </div>
                    <div class="col s12 m6">
                        <p>销售走势</p>
                        <div class="divider"></div>
                        <div class="card-con" id="brand-detail-line" style="height: 400px;"></div>
                    </div>
                </div>
                <div class="col s12">
                    <div class="col s12 m6">
                        <p>店铺销售排行榜</p>
                        <table>
                            <thead>
                                <tr>
                                    <th>排名</th>
                                    <th>销售额</th>
                                    <th>销售量</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>1</td>
                                    <td>1</td>
                                    <td>1</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="col s12 m6">
                        <p>宝贝销售排行榜</p>
                        <table>
                            <thead>
                                <tr>
                                    <th>排名</th>
                                    <th>标题</th>
                                    <th>销售额</th>
                                    <th>销售量</th>
                                    <th>排名</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>1</td>
                                    <td>1</td>
                                    <td>1</td>
                                    <td>1</td>
                                    <td>1</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--销售量  -->
    <div class="row" id="anchor2">
        <div class="col s12">
            <div class="card-panel clearfix">
                <h5>销售量</h5>
                <div class="divider"></div>
                <div class="col s12 m6">
                    <p>平台销售量</p>
                    <div id="brand-detail-component-sellAmount" style="height: 400px;">
                    </div>
                </div>
                <div class="col s12 m6">
                    <p>宝贝销售量排行榜</p>
                    <table>
                        <thead>
                            <tr>
                                <th>排名</th>
                                <th>排名</th>
                                <th>排名</th>
                                <th>排名</th>
                                <th>排名</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!-- 店铺数 -->
    <div class="row" id="anchor3">
        <div class="col s12">
            <div class="card-panel clearfix">
                <h5>店铺数</h5>
                <div class="divider"></div>
                <div class="col s12 m6">
                    <p>店铺平台数占比</p>
                    <div id="brand-detail-component-sellShop" style="height: 300px;">
                    </div>
                </div>
                <div class="col s12 m6">
                    <p>店铺排行榜</p>
                    <table>
                        <thead>
                            <tr>
                                <th>排名</th>
                                <th>排名</th>
                                <th>排名</th>
                                <th>排名</th>
                                <th>排名</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!-- table -->
    <div class="row" id="anchor4">
        <div class="col s12">
            <div class="card-panel">
                <h5>
                <ul>
                  <li><a hraf="javascript:;">店铺</a></li>
                  <li><a hraf="javascript:;">宝贝</a></li>
                </ul>
                </h5>
                <div class="divider"></div>
                <table class="centered responsive-table">
                    <thead>
                        <tr>
                            <th>header</th>
                            <th>header</th>
                            <th>header</th>
                            <th>header</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>data</td>
                            <td>data</td>
                            <td>data</td>
                            <td>data</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
